<template>

  <a-drawer
    width="75%"
    closable
    placement="right"
    :visible="visible"
    @close="visible=false"
  >

    <div slot="title" class="g-flex g-y-center">
      <div style="color: #000000;font-weight: bold;">项目详情</div>
      <div style="font-size: 12px;margin-left: 30px;color: #333333;">姓名：{{ row_record.name }}</div>
      <div style="font-size: 12px;margin-left: 20px;color: #333333;">卡号：{{ row_record.cardNo }}</div>
    </div>
    <a-spin :spinning="spinning">
      <a-table
        size="small"
        :scroll="{x:1000}"
        :columns="innerColumns"
        :data-source="tableData"
        :rowKey="(record,index)=> index"
      >
        <!--序号-->
        <template slot="index" slot-scope="text,record,index">
          <span>{{ index + 1 }}</span>
        </template>
      </a-table>
    </a-spin>
  </a-drawer>

</template>

<script>
import { noChargeItem } from '@/api/modular/main/customer/cashier'

export default {
  props: {
    row_record: {
      type: Object,
      default: () => {
        {
        }
      }
    }
  },
  data() {
    return {
      tableData:[],
      spinning: true,
      visible: false,
      form: this.$form.createForm(this),
      innerColumns: [
        { title: '序号', scopedSlots: { customRender: 'index' }, width: 50, fixed: 'left' },
        { title: '活动', dataIndex: 'achieveDept', width: 70, ellipsis: true },
        { title: '科室', dataIndex: 'execDept', width: 70, ellipsis: true },
        { title: '项目名称', dataIndex: 'itemName', width: 70, ellipsis: true },
        { title: '数量', dataIndex: 'qty', width: 70, ellipsis: true },
        { title: '单位', dataIndex: 'unit', width: 70, ellipsis: true },
        { title: '原价', dataIndex: 'itemPrice', width: 70, ellipsis: true },
        { title: '折扣', dataIndex: 'discount', width: 70, ellipsis: true },
        { title: '折扣说明', dataIndex: 'discountRemark', width: 80, ellipsis: true },
        { title: '应收金额', dataIndex: 'payableAmt', width: 80, ellipsis: true },
        { title: '未收金额', dataIndex: '12', width: 80, ellipsis: true },
        { title: '转单人', dataIndex: 'biller', width: 70, ellipsis: true },
        { title: '转单日期', dataIndex: 'billDate', width: 80, ellipsis: true },
        { title: '业务类型', dataIndex: '15', width: 70, ellipsis: true },
        { title: '类型', dataIndex: 'itemType', width: 70, ellipsis: true },
        { title: '项目备注', dataIndex: 'remark', width: 70, ellipsis: true }
      ]
    }
  },
  methods: {
    show() {
      this.visible = true
      this.$nextTick(() => {
        this.spinning = true
        const orderId = this.row_record.orderId
        noChargeItem({ orderId }).then(res => {
          this.spinning = false
          // console.log('未收费-项目详情', res.data)
          this.tableData = res.data
        })
      })
    }
  }
}
</script>

<style lang="less" scoped>

</style>

